<template>
  <VanPullRefresh
    class="refresh-list"
    v-model="refreshing"
    @refresh="onRefresh"
  >
    <template v-if="empty">
      <BaseEmpty :description="emptyText" />
    </template>
    <VanList
      v-else
      v-model:loading="loading"
      v-model:error="error"
      :finished="finished"
      :finished-text="finishedText"
      :error-text="errorText"
      v-bind="$attrs"
      @load="onLoad"
    >
      <template v-if="initing">
        <slot name="init">
          <BaseEmpty />
        </slot>
      </template>
      <template v-else>
        <slot :list="list"></slot>
      </template>
      <template #error>
        <slot name="error">
          <BaseEmpty :description="errorText" />
        </slot>
      </template>
    </VanList>
  </VanPullRefresh>
</template>

<script setup>
import { usePager } from "@/utils/pagerUtils.js";

const props = defineProps({
  request: Function,
  runNow: {
    type: Boolean,
    default: true,
  },
});
const emit = defineEmits(["init"]);

// 获取列表
const {
  loading,
  error,
  finished,
  refreshing,
  list,
  onLoad,
  onRefresh,
  finishedText,
  errorText,
  totalNum,
  pageNum,
  emptyText,
  empty,
  initing,
  loadingText,
} = usePager({
  request: (pageNum) => {
    if (props.request instanceof Function) {
      return props.request(pageNum);
    } else {
      return {
        rows: [],
        total: 0,
      };
    }
  },
  runNow: props.runNow,
});

emit("init", {
  loading,
  error,
  finished,
  refreshing,
  list,
  onLoad,
  onRefresh,
  finishedText,
  errorText,
  totalNum,
  pageNum,
  emptyText,
  empty,
  initing,
  loadingText,
});
</script>

<style lang="scss" scoped></style>
